//规律信息图
function RegularChart(dom,data,option){
	//创建画布
	function createSvg(dom,option){
		return d3.select(dom)
			     .append('svg')
			     .attr('width',option.width)
			     .attr('height',option.height);
	}
	let svg = createSvg(dom,option);
	//定义画图区域
	let chartArea = svg.append('g')
				       .attr('class','chartArea')
				       .attr('transform','translate('+option.padding.left+','+option.padding.top+')');
    //定义X轴的比例尺
    let xScale = d3.scale.ordinal()
			   .domain(data.xData)
			   .rangePoints([0,option.width - option.padding.left - option.padding.right],1);
	//定义Y轴的比例尺
	let yScale = d3.scale.ordinal()
			   .domain(data.yData)
			   .rangePoints([0,option.height - option.padding.top - option.padding.bottom],1);

			   //定义X轴  
	let xAxis = d3.svg.axis()
					  .scale(xScale) 
					  .orient("bottom");
					   
	//定义Y轴  
	var yAxis = d3.svg.axis()
					  .scale(yScale) 
					  .orient("left");
					  //定义X轴区域
	var xAxisArea = svg.append('g')
	                .attr('class','xAxisArea')
	                .attr('transform','translate('+option.padding.left+','+(option.height - option.padding.bottom)+')')
					.call(xAxis);
	//定义Y轴区域
	var yAxisArea = svg.append('g')
	                .attr('class','yAxisArea')
	                .attr('transform','translate('+option.padding.left+','+ option.padding.top+')')
	                .call(yAxis);

	var rectStep = (option.width - option.padding.left - option.padding.right)/data.xData.length;
	var rectWidth = rectStep -1;
	var rectHeight = (option.height - option.padding.top - option.padding.bottom)/data.yData.length;;
	//画垂直g,有多少行就多少个g,先竖着画，再横着画
	chartArea.selectAll('.group-vertical')
			 .data(data.yData)
			 .enter()
			 .append('g')
			 .attr('transform',function(d,i){
				 return 'translate('+0+','+i*rectHeight+')';
			 })
			 .attr('class',function(d,i){
				 return 'group-vertical-'+i;
			 });
		//画水平g		 
	var temg = null;
	for(var i=0;i<data.yData.length;i++){
		temg = chartArea.select('.group-vertical-'+i);
		temg.selectAll('rect.rect-inner-cell')
			.data(data.xData)
			.enter()
			.append('rect')
			.attr('class','rect-inner-cell')
			.attr('x',function(d,i){
				return xScale(d) - rectWidth/2;
			})
			.attr('y',function(d,i){
				return 0;
			})
			.attr('width',rectWidth)
			.attr('height',rectHeight-1)
			.attr('fill',function(d,i){
				return '#3399FF';
			});
	}	
}
module.export = window.RegularChart = RegularChart;